<template>
    <Modal :mask-closable="false"
            v-model="repairVisible"
            :title="!formTop.id ? '添加备件' : '编辑备件'"
    >
        <Form ref="repairDetailForm" :model="formTop" label-position="top" :rules="validateRepair">
            <Row :gutter="16">
                <Col :span="12">
                    <FormItem label="物料名称" prop="maName">
                        <Input v-model="formTop.maName" />
                    </FormItem>
                </Col>
                <Col :span="12">
                    <FormItem label="规格型号" prop="maModel">
                        <Input v-model="formTop.maModel" />
                    </FormItem>
                </Col>
            </Row>
            <Row :gutter="16">
                <Col :span="12">
                    <FormItem label="使用数量" prop="useNum">
                        <Input v-model="formTop.useNum" />
                    </FormItem>
                </Col>
                <Col :span="12">
                    <FormItem label="品牌" prop="brand">
                        <Input v-model="formTop.brand" />
                    </FormItem>
                </Col>
            </Row>
        </Form>
        <div slot="footer">
            <Button type="default" @click="handleCancel">{{$t('common.Cancle')}}</Button>
            <Button type="primary" :loading="loadingVisible" @click="handleOk">{{$t('maintenance.Confirmed')}}</Button>
        </div>
    </Modal>
</template>

<script>
    export default {
        name: "addRepairDetailModal",
        data() {
            return {
                id: '',
                workorderNo: '',
                repairVisible: false,
                loadingVisible: false,
                formTop: {
                    maName: '',
                    maModel: ''
                },
                validateRepair: {
                    maName: [
                        { required: true, message: '请输入名称', trigger: 'blur' }
                    ],
                    maModel: [
                        { required: true, message: '请输入规格型号', trigger: 'blur' }
                    ],
                },
            }
        },
        methods: {
            add(detailObj) {
                this.repairVisible = true
                this.id = detailObj.id
                this.workorderNo = detailObj.workorderNo
                this.formTop = {}
            },
            edit(record,detailObj) {
                this.id = detailObj.id
                this.workorderNo = detailObj.workorderNo
                this.repairVisible = true
                this.getDetail(record.id)
            },
            getDetail(id) {
                this.axios({
                    method: 'get',
                    url: '/workorder/workorderRecord/queryById',
                    params: {
                        id
                    }
                }).then(res => {
                    
                    if (res.code === 200) {
                        this.formTop = res.data
                    }else {
                        this.$Message.warning(({content:res.msg,duration:6,closable:true}))
                    }
                }).finally(() => {
                })
            },
            handleCancel() {
                this.repairVisible = false
            },
            handleOk() {
                let data = {
                    ...this.formTop,
                    fid: this.id,
                    workorderNo: this.workorderNo
                }
                this.$refs.repairDetailForm.validate((valid) => {
                    if (valid) {
                        if (!this.formTop.id) {
                            this.axios({
                                method: 'post',
                                url: '/workorder/workorderRecord/add',
                                data
                            }).then(res => {
                                
                                if (res.code === 200) {
                                    this.$Message.success('新增成功！')
                                    this.$emit('handleRefreshAdd', res.data)
                                } else {
                                    this.$Message.warning(({content:res.msg,duration:6,closable:true}))
                                }
                            }).finally(() => {
                                this.repairVisible = false
                                this.loadingVisible = false
                            })
                        } else {
                            this.axios({
                                method: 'put',
                                url: '/workorder/workorderRecord/edit',
                                data
                            }).then(res => {
                                
                                if (res.code === 200) {
                                    this.$Message.success('编辑成功！')
                                    this.$emit('handleRefreshEdit', res.data)
                                } else {
                                    this.$Message.warning(({content:res.msg,duration:6,closable:true}))
                                }
                            }).finally(() => {
                                this.repairVisible = false
                                this.loadingVisible = false
                            })
                        }
                    }
                })
            }
        }
    }
</script>

<style scoped>

</style>
